<template>
    <div>
        <div class="now">
            <p>
                当前余额
            </p>
            <span id="balance">
                ￥{{userInfot.accountBalance}}
            </span>
        </div>
        <div class="box">
            <div class="box_top">
                 <!-- <h5>请输入兑换金额</h5> -->
                <span class="dl">￥</span>
                <input type="text" maxlength="9" placeholder="请输入要兑换的金额数" v-model="postSo.balance" onkeyup="this.value= this.value.match(/\d+(\.\d{0,1})?/) ? this.value.match(/\d+(\.\d{0,1})?/)[0] : ''" onblur='this.value=this.value.replace(/^[0]+[0-9]*$/gi,"")'>
                <button class="btn" @click="getAssetsbys()">确认</button>
            </div>
            <div class="box_bottom">
                <p>说明：用户可以随时进行积分兑换，兑换比例1:10，兑换成功后可进去积分管理页面进行查看您的积分</p>
            </div>
        </div>
    </div>
</template>

<script>
import http from "@/assets/js/axios"
import { domain } from '@/assets/js/config'
import $ from 'jquery'
import { maskTips } from '@/assets/js/dom'
export default {
    data() {
        return {
            userInfot: {},
            userToken: '',
            postSo: {
                balance: ''
            }
        }
    },
    components: {

    },
    mounted() {
        let userToken = localStorage.getItem("token") || ''
        this.userToken = userToken
        this.getIntegral();
    },
    methods: {
        direct: function (val) {
            this.$router.push({ path: '/' + val });
        },
        getIntegral: async function () {
            const res = await http.post('xshk/f/assets/query?token=' + this.userToken)
            if (res.data.code == -5) {
                maskTips({ id: "bal-fail", txt: res.data.message })
                this.$router.push('/login')
                return false;
            }
            if (res.status == 200) {
                this.userInfot = res.data.data
            }
        },
        getAssetsbys: async function () {
            // if(this.userInfot.takeCount==0){
            //    maskTips({ id: "no-times", txt: '兑换次数已用完' }) 
            //    return false;
            // }
            const res = await http.post('xshk/f/assets/balanceToPoints?token=' + this.userToken, this.postSo)
            if (res.data.code == 0) {
                this.forms = res.data
                maskTips({ id: "exchange-succ", txt: res.data.message })
                setTimeout(function () {
                    window.location.reload();
                }, 1000);

            } else {
                maskTips({ id: "exce-fail", txt: res.data.message })
            }
        }
    }
}
</script>

<style  scoped>
/*当前余额*/
.now{
  width: 88.5%;
  height: 3rem;
  text-align: center;
  color: #fff;
  position: relative;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: .4rem auto 0;
  background:#aad114;
  box-sizing: border-box;
  padding: .78rem 0;
}

.now p {
  font-size: 0.4rem;
  color: #ddffe8;
  font-family: "MicrosoftYaHei";
}
.now span {
  font-size: 0.6rem;
  font-weight: 900;
  font-family: "MicrosoftYaHei-Bold";
}

.box{
  padding: 0 .48rem;
  box-sizing: border-box;
}
.box .box_top h5{
  margin-top: 0.4rem;
  font-size: 0.3rem;
  font-weight: 500;
  color: #3b3b3b;
  font-family: "PingFang-SC-Medium";
}
.box .box_top input{
  box-sizing: border-box;
  width: 100%;
  height: 1rem;
  float: left;
  border: none;
  outline: none;
  font-size: 0.45rem;
  line-height: 0.6rem;
  font-weight: 600;
  border-bottom: 1px solid #f5f5f5;
  margin: 0 auto 0.48rem;
  font-family: "PingFang-SC-Heavy";
  position: relative;
  padding: 0 .6rem;
}
.dl{
  position:absolute;
  height:1rem;
  z-index: 9;
  font-family: "PingFang-SC-Heavy";
  font-size: 0.6rem;
  line-height: 0.6rem;
  font-weight: 600;
  float: left;
  padding-top: 10px
}
::-webkit-input-placeholder { /* WebKit browsers */
  color: #999;
  font-size: 0.45rem;
  line-height: 0.6rem;
  text-align: left;
  font-weight: 600;
  font-family: "PingFang-SC-Heavy";
}
.box .box_top .btn{
  float: left;
  width: 100%;
  height: .96rem;
  border: none;
  outline: none;
  background: #aad114;
  border-radius: 5px;
  color: #fff;
  margin-bottom: .4rem;
  font-size: .37rem;
}
.box .box_bottom{
  font-size:.24rem;
  color:#999;
  font-family: "PingFang-SC-Regular";
}
.box .box_bottom p{
  line-height: .48rem;
  font-family: "PingFang SC";
}
</style>

